<% if user_signed_in? %>
  <button class="mashme-button" id="mashme-button-excursion">
    <i class="icon"></i>
    <span class="text"><%=t('mashme.launch')%></span>
  </button>
<% end %>

<%= content_for :javascript do %>
  var launchIframe = function(src) {
    var darkener = document.createElement('div');
    darkener.setAttribute('class', 'mashme-darkener');

    var iframeDiv = document.createElement('div');
    darkener.appendChild(iframeDiv);

    var closeIframeDiv = document.createElement('div');
    closeIframeDiv.setAttribute('class', 'close-iframe');
    darkener.appendChild(closeIframeDiv);
    closeIframeDiv.onclick = function(){
      darkener.parentNode.removeChild(darkener);
    };

    var iframe = document.createElement('iframe');
    iframe.setAttribute('src', src);
    iframeDiv.appendChild(iframe);

    var resizeCallback = function() {
      iframeDiv.style.height = '100%';
      iframe.style.height = '100%';
      var height = iframe.offsetHeight;
      iframe.style.height = (height - 50) + 'px';
      iframeDiv.style.height = '';
    }
    window.onresize = resizeCallback;
    document.body.appendChild(darkener);
    resizeCallback();
  }

  $('.mashme-invites .btn').on("click", function(){
    $(this).toggleClass("btn-info");
  });

  $('#mashme-button-excursion').on("click", function(){
    var target_url = encodeURI("<%= request.url %>" + "|||" + $('#mashme-room-id').val());
    var target_title = encodeURI("<%= @event.title.split(' ').map {|w| w.capitalize }.join('') unless @event.title.blank? %>");
    name="<%= if user_signed_in?; then CGI::escapeHTML(current_subject.name); else ""; end %>"

    $.ajax({
      url: "https://www.mashme.tv/api/buttons",
      type: "POST",
      data: {
        url: target_url,
        title: target_title,
        theme: "vish",
      },
      success: function(data) {
        my_data = JSON.parse(data);
        launchIframe("https://www.mashme.tv/M/" + my_data.permalink + "?name=" + name + "&delay=9000&app=meeting_mode");
      }
    });
  });

  $('.collapse').collapse({parent: "#excursion-share"});

<% end %>
